<template>
  <div>
    <el-row>
      <el-col :span="24" class="addRole">
        <!-- 查询 -->
        <!-- <el-popover placement="bottom-start" width="1000" style="margin-right:10px;" trigger="click">
          <el-form :inline="true" :model="search">

              <el-form-item label="编号" >
                  <el-input v-model="search.code"></el-input>
              </el-form-item>
              <el-form-item label="名称" >
                  <el-input v-model="search.name"></el-input>
              </el-form-item>
              <el-form-item label="直径" >
                  <el-input v-model="search.diameter"></el-input>
              </el-form-item>
              <el-form-item label="深度" >
                  <el-input v-model="search.depth"></el-input>
              </el-form-item>
              <el-form-item label="刃长" >
                  <el-input v-model="search.blade"></el-input>
              </el-form-item>            
              <el-button type="primary" @click="searchBtn">确认</el-button>
          </el-form>
          <el-button slot="reference" type="primary" icon="el-icon-search">查询</el-button>
        </el-popover> -->
        <el-button type="primary" @click="dialogShow('','insert')">新增</el-button>
      </el-col>
    </el-row>
    <el-table  :data="detailTableList"  tooltip-effect  highlight-current-row border stripe>
          <el-table-column property="id"   label="序号" min-width="120" align="center"></el-table-column>
          <el-table-column property="name" label="名称" min-width="120" align="center" sortable></el-table-column>
          <el-table-column property="" label="操作" min-width="80" align="center" >
            <template slot-scope="scope">
              <el-button type="text" size="small" @click="dialogShow(scope.row,'update')" >编辑</el-button>
              <el-button @click="remove(scope.row)" type="text" size="small">删除</el-button>
            </template>
          </el-table-column>
    </el-table>
    <!-- 新增页面 -->
    <el-dialog :title="dialog1.title" :visible.sync="dialog1.isShow" v-dialogDrag append-to-body width="1360px" >
      <div style="height:700px">
        <!-- 查询 -->
        <el-popover placement="bottom-start" width="900" style="margin-right:10px;" trigger="click">
          <el-form :inline="true" :model="search">
              <el-form-item label="编号" >
                  <el-input v-model="search.code"></el-input>
              </el-form-item>
              <el-form-item label="名称" >
                  <el-input v-model="search.name"></el-input>
              </el-form-item>
              <el-form-item label="直径" >
                  <el-input v-model="search.diameter"></el-input>
              </el-form-item>
              <el-form-item label="深度" >
                  <el-input v-model="search.depth"></el-input>
              </el-form-item>
              <el-form-item label="刃长" >
                  <el-input v-model="search.blade"></el-input>
              </el-form-item> 
              <br>       
              <el-button type="primary" @click="searchBtn" style="float:right;margin-left:10px;">确认</el-button>&nbsp;&nbsp;
              <el-button  @click="resetSearch" type="primary"  style="float:right;">重置</el-button>
          </el-form>
          <br>
          <el-button slot="reference" type="primary" icon="el-icon-search">查询</el-button>
        </el-popover>
          <el-button @click="dialogShow2('','insert')" type="primary" icon="el-icon-search">新增</el-button>
          <br>
          <br>
        <el-table  :data="productionDataList"  tooltip-effect  highlight-current-row border stripe>
          <el-table-column property="name" label="名称" min-width="120" align="center" sortable></el-table-column>
          <el-table-column property="code" label="编号" min-width="60" align="center" sortable></el-table-column>
          <el-table-column property="diameter" label="直径" min-width="80" align="center" sortable></el-table-column>
          <el-table-column property="depth" label="深度" min-width="80" align="center" sortable></el-table-column>
          <el-table-column property="blade" label="刃长" min-width="80" align="center" sortable></el-table-column>
          <el-table-column property="mo" label="磨" min-width="120" align="center" sortable></el-table-column>
          <el-table-column property="count" label="数量" min-width="80" align="center" sortable></el-table-column>
          <el-table-column property="remark" label="备注" min-width="120" align="center" sortable></el-table-column>
          <el-table-column property="creatorName" label="创建人" min-width="120" align="center" sortable></el-table-column>
          <el-table-column property="createTime" label="创建时间" min-width="180" align="center" sortable>
            <template slot-scope="scope">
              {{timestampToTime(scope.row.createTime,'yyyy-mm-dd hh:mm:ss')}}
            </template>
          </el-table-column>
          <el-table-column fixed="right" label="操作" align="center" min-width="120">
              <template slot-scope="scope">
                <el-button type="text" size="small" @click="dialogShow2(scope.row,'update')" >编辑</el-button>
                <el-button @click="remove2(scope.row)" type="text" size="small">删除</el-button>
              </template>
          </el-table-column>
        </el-table>
        <el-pagination  @size-change="handleSizeChange" @current-change="handleCurrentChange" :current-page="currentPage" :page-sizes="[5,10, 15,20, 25,30,50, 100]" :page-size="pageSize" layout="total, sizes, prev, pager, next, jumper" :total="total"></el-pagination>

      </div>
    </el-dialog>
    <el-dialog :title="dialog2.title" :visible.sync="dialog2.isShow" :close-on-click-modal="false" width="700px">
      <el-form label-position="right" label-width="100px" :model="childrenData">
          <el-form-item label="单一资源ID">
              <el-input v-model="childrenData.groupId" disabled></el-input>
          </el-form-item>
          <el-form-item label="名称">
              <el-input v-model="childrenData.name"></el-input>
          </el-form-item>
          <el-form-item label="编号">
              <el-input v-model="childrenData.code"></el-input>
          </el-form-item>
          <span v-if="dialog2.type==1">
          <el-form-item label="直径">
              <el-input v-model="childrenData.diameter" ></el-input>
          </el-form-item>
          <el-form-item label="深度">
              <el-input v-model="childrenData.depth"></el-input>
          </el-form-item>
          <el-form-item label="刃长">
              <el-input v-model="childrenData.blade"></el-input>
          </el-form-item>
          <el-form-item label="磨">
              <el-input v-model="childrenData.mo"></el-input>
          </el-form-item>
          </span>
          <el-form-item label="数量">
              <el-input v-model="childrenData.count" ></el-input>
          </el-form-item>
          <el-form-item label="备注">
              <el-input v-model="childrenData.remark"></el-input>
          </el-form-item>
      </el-form>
      <div slot="footer" class="dialog-footer">
          <el-button type="primary" @click="submitDialog2">确 定</el-button>
      </div>
    </el-dialog>
    <!-- 详情框 -->
    <el-dialog :title="dialog.title" :visible.sync="dialog.isShow" :close-on-click-modal="false" width="700px">
      <el-button v-if="dialog.title ==='编辑节点'" type="primary" @click="detailList">资源清单</el-button>
      <br>
      <br>
      <el-form label-position="right" label-width="100px" :model="menuData">
          <el-form-item label="资源名称">
              <el-input v-model="menuData.name"></el-input>
          </el-form-item>
      </el-form>
      <div slot="footer" class="dialog-footer">
          <el-button type="primary" @click="submitDialog">确 定</el-button>
      </div>
    </el-dialog>
  </div>
</template>
<script>
import planApi from 'plugins/axios/planApi.js';
import baseApi from 'plugins/axios/baseApi.js';
export default {
  components: {
  },
  data(){
    return {
      currentPage:1,
      pageSize:10,
      total:0,
      status:'0',
      machineAllList:[],/**所有机器列表 */
      detailTableList:[],
      productionDataList:[],
      search:{
        code:"",
        name:"",
        diameter:"",
        depth:'',
        blade:'',
        hasCount:'',
        groupId:'',
        parentId:'',
      },
      dialog:{
        title:'',
        isShow:false
      },
      dialog1:{
        title:'',
        isShow:false
      },
      dialog2:{
        title:'',
        isShow:false,
        type:0,
      },
      childrenData:{
        name:'',
        code:'',
        diameter:'',
        depth:'',
        blade:'',
        mo:'',
        count:'',
        remark:'',
        groupId:0,
      },
      menuData:[],
    }
  },
  mounted(){

  },
  created(){
    this.getPorduction();
  },
  watch: {
    // $route(){
    //   this.getTablList();
    // }
  },
  methods:{
    handleSizeChange(val){
            let self = this;
            self.pageSize = val;
            this.queryWkdjList();
    },
    handleCurrentChange(val){
            let self = this;
            self.currentPage = val;
          this.queryWkdjList();
    },
    detailList(){
      let self = this;
      self.dialog1.isShow = true;
      self.search.groupId = self.menuData.id;
      /**
       *  blade: null
          code: null
          count: 5
          createTime: null
          creator: null
          creatorName: null
          depth: null
          diameter: null
          group: null
          groupId: 1
          id: 1
          mo: null
          name: "刀1"
          remark: null
       * 
       */
      self.queryByCondition();
    },
    resetSearch(){
      let self = this;
      self.search={
        code:"",
        name:"",
        diameter:"",
        depth:'',
        blade:'',
        hasCount:'',
        groupId:this.menuData.id,
        parentId:'',
      }
      self.queryByCondition();
    },
    resetSearchChildData(){
      this.childrenData = {
        name:'',
        code:'',
        diameter:'',
        depth:'',
        blade:'',
        mo:'',
        count:'',
        remark:'',
        groupId:0,
      };
      self.queryByCondition();
    },
    queryByCondition(){
      let self = this;
      self.search.currentPage =  self.currentPage;
      self.search.pageSize =  self.pageSize;
      planApi.queryByCondition(self.search).then(res=>{
        self.productionDataList = res.content.records;
        self.total =  self.productionDataList.length;
      });
    },
    dialogShow(data,type){/**添加节点 */
      let self = this;
      self.menuData={
        id: '',
        parentId:0,
        name: '',
      };
      if(type==='insert'){
        self.dialog.title ='新增节点';
      }else if (type==='update'){
         self.dialog.title ='编辑节点';
         self.menuData = {
            id: data.id,
            name:data.name,
            parentId:data.parentId
         }
      }else{
        self.dialog.title ='新增顶级节点';
      }
      self.dialog.isShow = true;
    },
    dialogShow2(data,type){
      let self = this;
      self.dialog2.isShow = true;
      self.childrenData.groupId =  self.menuData.id;
      if(type ==='insert'){
        self.dialog2.title = '新增';
        if(self.menuData.id==1){
          self.dialog2.type =1;
        }else if(self.menuData.id==2){
          self.dialog2.type =2;
        }else if(self.menuData.id==3){
          self.dialog2.type =3;
        }
      }else if(type ==='update'){
        self.dialog2.title = '编辑';
        self.childrenData =  data;
        if(self.menuData.id==1){
          self.dialog2.type =1;
        }else if(self.menuData.id==2){
          self.dialog2.type =2;
        }else if(self.menuData.id==3){
          self.dialog2.type =3;
        }
      }
    },
    submitDialog(){
      let self = this;
      let type =  self.dialog.title.indexOf('新增')>-1?'addProductionGroup':'editProductionGroup';
      planApi.addUpdateProductionGroup(type,self.menuData).then(res=>{
        self.dialog.isShow= false;
        self.getPorduction();
        self.$message.success(res.desc)
      })
    },
    submitDialog2(){
      let self = this;
      let type =  self.dialog2.title.indexOf('新增')>-1?1:2;
      self.childrenData.state = 1;//资源状态   0：待采购，1：已采购
      if(type==1){
          planApi.insertProduction(self.childrenData).then(res=>{
            self.dialog2.isShow= false;
            self.queryByCondition();
            self.resetSearchChildData();
            self.$message.success(res.desc)
          })
      }else{
          planApi.editProduction(self.childrenData).then(res=>{
            self.dialog2.isShow= false;
            self.queryByCondition();
            self.resetSearchChildData();
            self.$message.success(res.desc)
          })
      }
    },
    remove(data){
      let self = this;
      self.$confirm('确认删除吗?', '提示', {
          confirmButtonClass: 'el-button--warning'
      }).then(() => {
          planApi.deleteProductionGroup(data.id).then(res=>{
            self.getPorduction();
            self.$message.success(res.desc)
          })
      }).catch(() => {
      });
    },
    remove2(data){
      let self = this;
      self.$confirm('确认删除吗?', '提示', {
          confirmButtonClass: 'el-button--warning'
      }).then(() => {
        planApi.delProduction(data.id).then(res=>{
                self.queryByCondition();
                self.$message.success(res.desc)
        })
      }).catch(() => {
      });
    },
    getPorduction(){
      let self = this;
      planApi.productionGroupNodeAll().then(res=>{
        self.detailTableList = res.content.children;
      })
    },

    searchBtn(){
      this.queryByCondition();
    },
    showDialog(type,row){
      this.dialog.activeName='7';
      this.dialog.type = type;
      switch(type){
        case 'insert':
          this.dialog.isShow=true;
          this.dialog.formData={};
          this.dialog.title = '新增计划任务';
          break;
        case 'update':
          this.dialog.isShow=true;
          this.dialog.formData = row;
          this.dialog.title = '计划详情';
          this.dialog.drawCode = row.drawCode;
          this.dialog.otherUpDataData.drawNo=row.drawCode;
          break;
      } 
    },
    showDialog1(type,row){
      this.dialog1.isShow=true;
      this.dialog1.type=type;
      switch(type){
        case 'insert':
          this.dialog1.formData={};
          this.dialog1.title = '新增29所工艺详情';
          break;
        case 'update':
          this.dialog1.formData = row;
          this.dialog1.title = '编辑29所工艺详情';
        break;
      }
    },
    /**详情切换tab*/ 
    dialogHandleClick(){
      let self = this;
      switch(self.dialog.activeName){
        case '2':
          self.$refs.processPlanList29Ref.getProcessPlanList();
          break;
        case '3':
          self.$refs.drawing.getTableList();
          break;
        case '4':
          self.$refs.technology.getTableList();
          break;
        case '5':
          self.$refs.graphicsFile.getTableList();
          break;
        case '6':
          self.$refs.processPlanListRef.getProcessPlanList();
          break;
        case '7':
          /**生产工序记录*/
          this.$refs.productionRecordListRef.getRecordList();
          break;
      }
    },
    dialogOpened(){
      this.dialog.type==='update'? this.$refs.productionRecordListRef.getRecordList():'';
    },
    dialogClosed(){
      this.$refs.productionRecordListRef.getRecordList();
    },
    /**显示编程页面列表*/ 
    showProgramDialog(row){
      let self= this;
      self.programDialog.isShow = true;
      self.programDialog.title =`${row.nameName}详情`;
      self.programDialog.programObj = {
        data:row,
        tid:row.id,
        drawCode:row.drawNo,
        processId:row.name
      };
    },
    openedProgramDialog(){
      this.$refs.programDetail.getProgramList();
    }
  }
}
</script>
<style lang="stylus" scoped>
  .addRole
    padding-bottom 10px
  .content-rowspan div
    padding-left: 13px;
    line-height: 46px;
    border-bottom: 1px solid #ECEDEE;
    &:last-child
      border-bottom:none
</style>